import { createApp, ref, nextTick } from 'vue'
import LoadingVue from './conponents/loading.vue'
import bigImgVue from './conponents/bigImg.vue'
// 混合工具组件 用于全局
const dom = ref(null)
export const showLoading = (el: any) => {
  const div: any = document.createElement('div')
  if (el) {
    el.appendChild(div)
  } else {
    document.body.appendChild(div)
  }
  const app: any = createApp(LoadingVue)
  app.mount(div)
  dom.value = div

  // 3.5秒后dom还在就销毁掉
  setTimeout(() => {
    app.unmount(div)
  }, 3500)
}

export const closeLoading = () => {
  nextTick(() => {
    dom.value && dom.value.remove()
  })
}

export const showImg = (url) => {
  const div: any = document.createElement('div')
  document.body.appendChild(div)
  const app = createApp(bigImgVue)
  app.mount(div)
  div.childNodes[0].childNodes[0].src = url || ''
  div.childNodes[0].onclick = () => {
    nextTick(() => {
      div && div.remove()
    })
  }
}
